.variant {
  .headline {
    font-size: 1.2em;
    font-style: italic;
    margin-bottom: 30px;
  }

  [data-oembed] {
    @extend %video;
  }
}

.variants {
  padding: 1em 0;

  .variant {
    @extend %flex-center;

    color: $c-font;
    height: 6em;

    @include transition;

    &:hover {
      background: mix($c-link, $c-bg-box, 20%);
    }

    &::before {
      font-size: 3.5em;
      margin-right: 1rem;
      opacity: 0.7;

      @include transition;
    }

    &:hover::before {
      opacity: 1;
    }

    h2 {
      @extend %roboto;

      font-size: 1.6em;
      text-transform: uppercase;
      letter-spacing: 3px;
    }

    h3 {
      margin: 0;
    }
  }
}
